<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<style type="text/css">
		body {
			background-color: skyblue;
			height: 1000px;
		}
		
		.float_box {
			height: 100%;
		}
		
		.float {
			width: 50px;
			height: 50px;
			border-radius: 50%;
			background-color: lightpink;
			position: absolute;
			pointer-events: none;
		}
	</style>

	<body>
		<div class="float_box">
			<a href="rochet.html">火箭升空</a>
			<a href="test.html">文本域</a>
			<div class="float"></div>
		</div>

	</body>
	<script type="text/javascript">
		var Link = document.querySelector("body");
		var Float_box = document.querySelector(".float_box"),
			Float = document.querySelector(".float");
		var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

		Link.addEventListener("mousemove", function(e) {
			Top = e.screenY - "120";
			Left = e.x - "30";
			Float.style.top = Top + "px";
			Float.style.left = Left + "px";
		})
	</script>

</html>